<template>
    <div>
      <button
        @mousedown="startIncrement"
        @mouseup="stopIncrement"
        @mouseleave="stopIncrement"
      >
        {{ number }}
      </button>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        number: 0,
        intervalId: null
      };
    },
    methods: {
      startIncrement() {
        this.intervalId = setInterval(() => {
          this.number++;
        }, 200);
      },
      stopIncrement() {
        clearInterval(this.intervalId);
      }
    }
  };
  </script>
  